<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>图片上悬浮按钮示例</title>
	<style>
		.image-container {
			position: relative;
			display: inline-block;
		}
		.image-container img {
			display: block;
		}
		.image-container .button-overlay {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			padding: 10px 20px;
			background-color: rgba(0, 0, 0, 0.5);
			color: white;
			border: none;
			border-radius: 5px;
			cursor: pointer;
			z-index: 10;
		}
	</style>
</head>
<body>
<div class="image-container">
	<img src="../image-1.png" alt="示例图片" width="300">
	<button class="button-overlay">点击我</button>
</div>
</body>
</html>
